<template>
  <div>
    <el-dialog
      :title="dialogTitle"
      :visible.sync="dialogVisible"
      width="20%">

        <el-form :model="form" :rules="rules" ref="form1" label-width="80px">
            <slot name='dialogSlot'></slot>
        </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary"  @click="save" :disabled="!dialogVisible" >保 存</el-button>
      </div>
    </el-dialog>


    <el-row style="margin-top: 0.5rem;">
      <el-col :span="21">
      <el-button-group >
        <el-button type="primary" @click="add()"  plain  icon="el-icon-plus"  :size="size">新增</el-button>
        <el-button type="primary" @click="edit()"   plain icon="el-icon-edit" :disabled="!currentRow"  :size="size">修改</el-button>
        <el-button type="primary" @click="del()"  plain  icon="el-icon-delete" :disabled="!currentRow"  :size="size">删除</el-button>
        <slot name='mybutton'></slot>
        <el-button type="success" @click="refreshbutton()"  plain  icon="el-icon-refresh"   :size="size">刷新</el-button>
      </el-button-group>
      </el-col>
      <el-col :span="3">

      </el-col>
    </el-row>
  <el-row style="margin-top: 0.625rem;">
      <el-table
       border ref="singleTable" :data="array" v-loading="loading" highlight-current-row  @current-change="handleCurrent" v-bind="tableAttrs" style="width: 100%" >
         <el-table-column v-for="items,idx in table" :key="idx" :property="items.field" :label="items.title"></el-table-column>
		 <slot name='soltTable'></slot>
      </el-table>
  </el-row>

  </div>
</template>

<script>
  export default{
    props:{
      listPath:{
        type:String,
        required:true,
      },
      dialogTitle:{
        type:String,
        default:'编辑'
      },
      savePath:{
        type:String,
        required:true,
      },
      table:{
        type:Array,
		default:()=>[]
      }
      ,
      rules:{
        type:Object,
        default:{},
      },
      deletePath:{
        type:String,
        required:true,
      },
       dialogForm:{
        type:Object,
        required:true
      },
      tableAttrs:{
        type:Object
      }
    },
    data() {
      return {
        loading:false,
        currentRow:null,
        size:"small",
        array:null,
        form:{},
        dialogVisible:false,
        queryParams:{
          search:''
        }
      }
    },
    methods:{
      handleCurrent(row,column,event) {
        this.currentRow = row;
      },
      add(){
        emptyObj(this.form);
        this.$emit('show-dialog',this.form);
        this.dialogVisible=true;
      },
      refreshbutton(){
        this.loading=true;
        this.refreshtable();
      },
      del(){
        this.$confirm('是否删除此条数据', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'info'
            }).then(() => {
              this.$ajax.post(this.deletePath,this.currentRow).then(res=>{
                var result=res.data;
                if(result.success){
                  this.$notify({
                    title: '提示',
                    message: '数据删除成功',
                    type: 'success',
                    position: 'bottom-right'
                  });
                  this.$emit('deleted',this.currentRow);
                  this.refreshtable();
                }
              }).catch(err=>{
                this.$message({
                  type: 'error',
                  message: '删除失败'
                });
              })
            }).catch(() => {
              this.$message({
                type: 'info',
                message: '已取消删除'
              });
            });
      },
      edit(){
		var ss ={};
		ss.id=this.currentRow.id;
		ss.name=this.currentRow.name;
		ss.pid=this.currentRow.pid;
		ss.pidname=this.currentRow.pidname;
        Object.assign(this.form, ss);
        this.$emit('show-dialog', this.form);
        this.dialogVisible=true;
      },
      save(){
        this.$refs.form1.validate(valid=>{
          if(valid){
            this.$ajax.post(this.savePath,this.form).then(res=>{
              var result = res.data;
              if(result.success){
                this.dialogVisible=false;
                this.$emit('save-succ',this.form);
                this.refreshtable();
                this.$notify({
                  title: '提示',
                  message: '数据保存成功',
                  type: 'success',
                  position: 'bottom-right'
                });
              }
            })
          }
        })
      },
      searChange(){

        this.refreshtable();
      },

      refreshtable(){
        this.$ajax.post(this.listPath,{}).then(res=>{
               var result=res.data;
               if(result.success){
                 this.array=result.data;
                 this.currentRow=null;
                 setTimeout(() => {
                   this.loading=false;
                 }, 250)
               }
             }).catch(res=>{})
      },
    },
    created() {
      this.form=this.dialogForm;
      this.refreshtable();
    }
  }

  function emptyObj(obj){
    for( var key in obj){
      var o = obj[key];
      if(o instanceof Object){
        emptyObj(o);
      }else{
        obj[key]='';
      }
    }
  }
</script>

<style>
</style>
